export const Child = {
  props: {
    msgContent: String
  },

  template: `
    <div>
      <slot name="h1"></slot>
      <slot name="default" msg="hello"></slot>
      <div>{{msg}}</div>
      <div>{{newMsg}}</div>
    </div>
  `,

  data() {
    return {
      h1: 'header 1',
      msg: this.msgContent
    }
  },

  computed: {
    newMsg() {
      return this.msgContent + '~~~'
    }
  },

  mounted() {
    // this.msg = 'hello child ~'
    // this.msgContent = 0
  },
}